<template>
  <div class="layout">
   <Sidebar/>
    <Headers></Headers>
    <Layout>
      <Bredcrumb/>
    </Layout>
     <router-view></router-view>
  </div>
</template>

    
    
<script>
import Header from "../public/Header.vue";
import Bredcrumb from "../public/Breadcrumb.vue";
import Sidebar from "../public/Sidebar.vue";

export default {
  components: {
    Headers:Header,
    Bredcrumb,
    Sidebar
  }
};
</script>

<style>
html,body,#app{
  height: 100%;
}
.layout{
        border: 1px solid #d7dde4;
        background: #f5f7f9;
        position: relative;
        border-radius: 4px;
        overflow: hidden;
        padding-left: 200px;
        /* height: 100%; */
        
    }
    .layout-header-bar{
        background: #fff;
        box-shadow: 0 1px 1px rgba(0,0,0,.1);
    }
    
</style>
